<!doctype html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link href="css/mui.min.css" rel="stylesheet" />
		<link rel="stylesheet" type="text/css" href="css/jiazai.css"/>
		<style type="text/css">
			body {
				background: white;
			}
			
			#top-contr {
				padding: 10px 20px;
			}
			
			.content {
				padding-top: 40px;
				padding: 40px 20px;
			}
			
			h1 {
				font-size: 22px;
				font-weight: 800;
				text-align: center;
			}
			
			.content>p:first-of-type {
				padding-top: 25px;
				font-size: 14px;
				line-height: 22px;
				letter-spacing: 1px;
				text-align: center;
			}
			
			.content>p:last-of-type {
				text-align: center;
			}
			
			.word {
				margin-top: 20px;
				min-height: 150px;
				padding: 15px;
				background: #f5f8ff;
				font-size: 16px;
				color: #999;
				border: none;
			}
			
			.backup-wrap {
				margin-top: 20px;
			}
			
			.backup-wrap>button {
				flex: 1 1 0;
				width: 100%;
				padding: 15px 0;
				font-size: 15px;
				color: white;
				background: #0c61ff;
				border-radius: 5px;
				border: none;
			}
			
			.backup-wrap>button:first-of-type {
				margin-right: 20px;
				background: transparent;
				color: #0c61ff;
				border: 1px solid #0c61ff;
			}
			
			#bottom {
				position: fixed;
				bottom: 40px;
				left: 0;
				right: 0;
				font-size: 15px;
				text-align: center;
				letter-spacing: 1px;
				color: #0C61FF;
			}
		</style>
	</head>

	<body>
		<div id="app">
			<!-- 加载中动画 -->
			<div id='jiazai-ani' v-if='jiazai'>
				<div class="arc"></div>
				<h1><span>LOADING</span></h1>
			</div>
			<!-- 加载中动画 -->
			<div id="top-contr" class='dis-spa'>
				<img @tap='_close();' src="img/left.svg" style="width: 18px;height: 18px;" />
				<span>备份助记词</span>
				<span style="opacity: 0;width: 18px;">1</span>
			</div>
			<div class="content">
				<h1>请备份助记词</h1>
				<p>按顺序输入助记词</p>
				<p>助记词之间请用“，”隔开</p>
				<textarea class="word" placeholder="在此输入助记词" v-model='input'>
					
				</textarea>
				<div class="dis-spa backup-wrap">
					<button @tap="_close();">上一步</button>
					<button @tap='sure'>确认备份</button>
				</div>
			</div>
			<div id="bottom" @tap='goIndex' v-if='!where'>
				跳过此步，以后备份
			</div>
		</div>
		<script src="js/comm.js" type="text/javascript" charset="utf-8"></script>
		<script src="js/mui.min.js"></script>
		<script src="js/vue.min.js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript">
			mui.plusReady(function(){
				app.$data.where=plus.webview.getWebviewById('index4');
			});
			var app = new Vue({
				el: '#app',
				data: {
					jiazai: false,
					input: '',
					//false:是第一次注册时备份   true:是从我的页面来备份的
					where:null
				},
				methods: {
					sure: function() {
						//验证上级页面的助记词和输入的助记词是否相等  相等就跑首页
						this.goIndex();
					},
					goIndex: function() {
						if(this.where){
							//説明是我的頁來的   备份完后  关闭两个页面回去
							var backup=plus.webview.getWebviewById('backupWord').close('none');
							var backup2=plus.webview.currentWebview().close('none');
						}else{
							//注册时的备份
							localStorage.setItem('kui_user', 'jkjjj');
							var This = this;
							This.jiazai = true;
							var op = {
								top: 0,
								left: 0,
								right: 0,
								bottom: '60px',
								statusbar: {
									background: '#2471ff'
								},
							};
							var web = plus.webview.create('index.html', 'index', op);
							web.addEventListener("loaded", function() {
								This.jiazai = false;
								web.show('none');
								setTimeout(function() {
									web.evalJS("closeOth()");
								}, 300);
							}, false);
						}
						
					}
				}
			});
		</script>
	</body>

</html>